
<template>
    <div class="search-drop-comp">
        <!-- <el-dropdown popper-class="cond-item-drop-box" trigger="click">
            <span class="cond-drop-txt">
                <span v-lang="{lang: controlSto.language, lgid: 8, list: controlSto.langList}"></span>
                <el-icon class="drop-arrow-img"><CaretBottom /></el-icon>
            </span>
            <template #dropdown>
                <slot name="dropcont">
                    
                </slot>
            </template>
        </el-dropdown> -->

          <!-- trigger="hover" -->
         <el-popover
            placement="bottom-start"
            trigger="hover"
            popper-class="cond-item-drop-box">
            <template #reference>
                <div class="show-box">
                    <slot name="title">
                    
                    </slot>
                    <el-icon class="arrow-img"><CaretBottom /></el-icon>
                </div>
            </template>

            <slot name="dropcont">
                    
            </slot>
        </el-popover>

        <!-- <div class="load-cont"> -->
            <!-- <div class=""></div>
            <div class="img-wrap arrow-box">
               <el-icon class="arrow-img"><CaretBottom /></el-icon>
            </div> -->
        <!-- </div> -->
    </div>
</template>

<script setup>

</script>


<style lang="scss" scoped>
    .search-drop-comp {
        display: inline-block;
        padding: 0;
        height: 32px;
        line-height: 32px;
        border: 1px solid #E0E0E0;
        border-radius: 4px;
        .show-box {
            display: flex;
            height: 32px;
            min-width: 80px;
            padding: 0 12px;
            justify-content: space-between;
            align-items: center;
            cursor: pointer;
            .arrow-img {
                color: #999;
            }
        }
    }
</style>


<style lang="scss">
    .cond-item-drop-box {
        width: auto !important;
        padding: 0 !important;
    }
</style>
